import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

import '../../theme.dart';
import '../../utils/lifecycle_aware.dart';

/// 重置摄像头引导页
class ResetPage extends StatefulWidget {
  const ResetPage({super.key});

  @override
  State<ResetPage> createState() => _ResetPageState();
}

class _ResetPageState extends LifecycleAwareState<ResetPage> {
  bool _isChecked = false; // 用于控制复选框的状态

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: _buildTitleBar(context),
      body: _buildRootBody(context),
    );
  }

  AppBar _buildTitleBar(BuildContext context) {
    return AppBar(
      leading: IconButton(
        icon: Icon(Icons.arrow_back_ios), // 使用没有横线的返回箭头图标
        onPressed: () {
          // 返回操作
          Navigator.of(context).pop();
        },
      ),
      title: const Text(
        '设备重置',
        style: TextStyle(
          fontSize: 17,
          fontFamily: "PingFang SC",
          fontWeight: FontWeight.w600,
        ),
      ),
      centerTitle: true, // 设置标题居中
    );
  }

  Widget _buildRootBody(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: <Widget>[
        const Padding(
          padding: EdgeInsets.all(16.0),
          child: Text(
            '1.重置智能摄像头',
            style: TextStyle(
                fontSize: 18,
                fontWeight: FontWeight.bold,
                color: SampleThemeConfigure.colorTextPrimary),
          ),
        ),

        const Padding(
          padding: EdgeInsets.symmetric(horizontal: 16.0),
          child: Text(
            '接入电源，长按重置按钮3秒以上，\n听到重置成功的语音提示后松手，等待重启后再进入下一步',
            style: TextStyle(
              fontSize: 16,
              color: SampleThemeConfigure.colorTextSub,
            ),
          ),
        ),

        Expanded(
          child: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Container(
              // color: const Color.fromRGBO(97, 94, 94, 0.138),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Expanded(
                    child: Container(
                      alignment: Alignment.center,
                      child: Image.asset(
                        'assets/app_img/eqaddone.png', // 替换为你的第一张本地图标路径
                      ),
                    ),
                  ),
                  Expanded(
                    child: Container(
                      alignment: Alignment.center,
                      child: Image.asset(
                        'assets/app_img/eqaddtwo.png', // 替换为你的第二张本地图标路径
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),

        // 添加复选框
        Center(
          // padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
          child: Row(
            children: [
              Spacer(),
              Checkbox(
                value: _isChecked,
                onChanged: (value) {
                  setState(() {
                    _isChecked = value ?? false;
                  });
                },
                checkColor: Colors.white,
                activeColor: SampleThemeConfigure.colorPrimary,
              ),
              const Text(
                '我已听到提示音或指示灯快闪',
                style: TextStyle(
                    fontSize: 14, color: SampleThemeConfigure.colorTextPrimary),
              ),
              Spacer(),
            ],
          ),
        ),

        // 第四部分：红色的圆角矩形按钮
        Padding(
          padding: const EdgeInsets.all(16.0),
          child: ElevatedButton(
            style: ElevatedButton.styleFrom(
              backgroundColor: SampleThemeConfigure.colorPrimary,
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(50.0),
              ),
              padding: const EdgeInsets.symmetric(vertical: 13),
            ),
            onPressed: _isChecked
                ? () {
                    Navigator.pop(context, true);
                  }
                : null, // 只有在复选框被勾选时，按钮才可点击
            child: const Text(
              '下一步',
              style: TextStyle(
                color: Colors.white,
                fontSize: 14,
              ),
            ),
          ),
        ),
      ],
    );
  }
}
